<!-- 用户信息及退出登录 -->
<template>
    <el-dropdown>
        <span class="el-dropdown-link">
            下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
        </span>
        <el-dropdown-menu slot="dropdown">
            <el-dropdown-item @click.native="userInfo()">个人中心</el-dropdown-item>
            <el-dropdown-item divided @click.native="logoutFn()">退出登录</el-dropdown-item>
        </el-dropdown-menu>
    </el-dropdown>
</template>

<script>
import { mapActions } from 'vuex'
export default {
    data() {
        return {
        };
    },

    methods: {
        ...mapActions('extends/user', ['logout']),

        // 退出登录
        logoutFn() {
            this.logout().then(res => {
                this.$message({ message: res, type: 'success' });
                this.$router.push({ path: '/login' })
            })
        },

        // 个人中心
        userInfo() {
            this.$message({ message: '个人中心', type: 'success' });
        }

    }
}

</script>
<style lang='less' scoped>
.el-dropdown {
    cursor: pointer;
}
</style>